<template>
  <div class="dw-toolbar-warpper">
    <template v-for="(item, index) in buttons" :key="index">
      <el-button v-if="!item.slotName" :type="item.type" @click="item.onClick">{{ item.text }}</el-button>
      <slot v-else :name="item.slotName" :config="item"></slot>
    </template>
  </div>
</template>
<script setup lang="ts">
import type { PropType } from 'vue';
import type { IButton } from '@/types/menu-datagrid-form';
defineOptions({
  name: 'DwBtnToolbar',
});
const props = defineProps({
  buttons: {
    type: Array as PropType<IButton[]>,
  },
});

const buttons = props.buttons || [];
</script>

<style lang="scss" scoped>
.dw-toolbar-warpper {
  padding-bottom: 10px;
  padding-left: 20px;
  padding-right: 20px;
}
</style>
